﻿<extend name="Public:office" />
<block name="title"><title>我的任务</title></block>
<block name="header_styles">
    <style type="text/css">
        .main-wrapper .container {
            background-color: #ffffff;
        }
    </style>
</block>
<block name="main">
    <div class="tabs-wrapper">
        <include file='Task:menu' />
        <div class="tab-content">
            <div class="tab-pane active" style="min-height: 600px;">
                <div class="btn-group" data-toggle="buttons">
                    <label class="btn btn-success active">
                        <input type="radio" name="options" id="rbToOthers" autocomplete="off" checked> 我发布的
                    </label>
                    <label class="btn btn-success">
                        <input type="radio" name="options" id="rbToMe" autocomplete="off"> 我领取的
                    </label>
                </div>
                <br /><br />
                <div class=" mytasks">
                    <div id="mytasktab">
                        <div class="mytasks-column">
                            <div class="mytasks-panel ">
                                <div class="panel-title">待认领</div>
                                <div class="panel-content" id="taskstatus1"></div>
                            </div>
                        </div><!-- mytasks-column end-->
                        <div class="mytasks-column">
                            <div class="mytasks-panel ">
                                <div class="panel-title">进行中</div>
                                <div class="panel-content" id="taskstatus2"></div>
                            </div>
                        </div><!-- mytasks-column end-->
                        <div class="mytasks-column">
                            <div class="mytasks-panel ">
                                <div class="panel-title">已提交</div>
                                <div class="panel-content" id="taskstatus3"></div>
                            </div>
                        </div><!-- mytasks-column end-->
                        <div class="mytasks-column">
                            <div class="mytasks-panel ">
                                <div class="panel-title">已验收</div>
                                <div class="panel-content" id="taskstatus4"></div>
                            </div>
                        </div><!-- mytasks-column end-->
                    </div>

                </div>
            </div>
        </div>
    </div>
</block>
<block name="footer_scripts">
    <script type="x-kendo-template" id="tplTaskItem">
        <div class="mytasks-item">
            <div class="mytasks-description">
                #:content#
            </div>
            <div class="mytasks-author">
                <div>
                     <label> 执行者:</label>&nbsp;#:rolename#
                </div>
                <div>
                    <label>创建者:</label>&nbsp;#:sender#
                </div>
                <div>
                    <label>期限:</label>&nbsp;#:deadline#
                </div>
                <div>
                    <select class="change-status" id='t_#:id#' data-id="#:id#">
                        <option value="1" #if(status==1){#selected#}#>待认领</option>
                        <option value="2" #if(status==2){#selected#}#>进行中</option>
                        <option value="3" #if(status==3){#selected#}#>已提交</option>
                        <option value="4" #if(status==4){#selected#}#>已验收</option>
                    </select>
                </div>
            </div>
        </div>
    </script>
    <script type="text/javascript">
        require(["jquery", "modules/message", "kendoui/kendo.web.min"], function ($, messageBox) {
            $(document).ready(function () {
                $("input[name='options']").change(function () {
                    var type = 1;

                    var checkedIem = $("input[name='options']:checked");
                    if (checkedIem.attr("id") == "rbToOthers") {
                        type = 2;
                    } else {
                        //console.log('单击 "别人分派给我的" 后 触发的事件');
                        type = 1;
                    }
                    loadTaskStatusByType(type);
                });

                $(".ul-stars li a").click(function () {
                    $(this).addClass("active");
                    var prevItems = $(this).closest("li").prevAll("li");
                    var nextItems = $(this).closest("li").nextAll("li");
                    prevItems.find("a").addClass("active");
                    nextItems.find("a").removeClass("active");
                    $(this).closest(".appraise-row").children(".appraise").val($(this).data("appraise"));
                });

                loadTaskStatusByType(2);
                initChangeStatus();
            });


            function loadTaskStatusByType(type) {
                $("#taskstatus1,#taskstatus2,#taskstatus3,#taskstatus4").html("");

                kendo.ui.progress($("#mytasktab"), true);
                $.ajax({
                    url: "{:U('Task/tasklist_ajax')}",
                    data: { type: type },
                    type: "get",
                    dataType: "json",
                    success: function (response) {
                        if (response.data.status1) {
                            renderTemplateHtml(1, response.data.status1);
                        }
                        if (response.data.status2) {
                            renderTemplateHtml(2, response.data.status2);
                        }
                        if (response.data.status3) {
                            renderTemplateHtml(3, response.data.status3);
                        }
                        if (response.data.status4) {
                            renderTemplateHtml(4, response.data.status4);
                        }
                        initChangeStatus();
                        kendo.ui.progress($("#mytasktab"), false);
                    }
                });
            }

            function renderTemplateHtml(status, data) {
                var tpl = kendo.template($("#tplTaskItem").html());
                var html = kendo.render(tpl, data);
                $("#taskstatus" + status).html(html);
            }

            function initChangeStatus() {
                $('.change-status').off("change").change(function () {
                    var type = $("#rbToMe").is(":checked") ? 1 : 2;
                    var url = "{:U('Task/setTaskstatus_ajax')}";
                    var id = $(this).data('id');
                    var status = $(this).find("option:selected").val();
                    if (status) {
                        $.post(url, { id: id, status: status }, function (data) {
                            var vdata = eval(data);
                            if (vdata.success == '1') {
                                loadTaskStatusByType(type);
                            } else {
                                messageBox.alert({ content: vdata.msg });
                            }
                        }, 'json');
                    }
                    return false;
                });
            }
        });
        
    </script>

</block>
